Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Fix colors not being applied to Mini-Cart Proceed to Checkout Button in the editor #9661

Merged

Conversation

Aljullu
Copy link
Contributor

@Aljullu Aljullu commented May 31, 2023

Fixes a regression that caused the Mini-Cart Proceed to Checkout Button not to show the correct colors in the Site Editor.

Testing

User Facing Testing

  1. Enable a block theme.
  2. Add the Mini-Cart block to the header of your store.
  3. Go to Appearance > Editor > Template Parts > Mini-Cart.
  4. Modify the text and background colors of Mini-Cart View Cart Button and Mini-Cart Proceed to Checkout Button. Try with colors from the palette and with custom colors. Try also changing the Style from Default to Outline/Fill_.
  5. Save the template part and reload the page. Verify the colors persisted.
  6. Go to the frontend, open the Mini-Cart drawer and verify the colors are applied correctly there too.
Before After
imatge imatge
  • Do not include in the Testing Notes

WooCommerce Visibility

  • WooCommerce Core
  • Feature plugin
  • Experimental

@Aljullu Aljullu added status: needs review skip-changelog PRs that you don't want to appear in the changelog. block: mini-cart Issues related to the Mini-Cart block. labels May 31, 2023
@Aljullu Aljullu added this to the 10.2.2 milestone May 31, 2023
@Aljullu Aljullu self-assigned this May 31, 2023
@woocommercebot woocommercebot requested review from a team and gigitux and removed request for a team May 31, 2023 10:46
@github-actions
Copy link
Contributor

github-actions bot commented May 31, 2023

The release ZIP for this PR is accessible via:

https://wcblocks.wpcomstaging.com/wp-content/uploads/woocommerce-gutenberg-products-block-9661.zip

Script Dependencies Report

There is no changed script dependency between this branch and trunk.

This comment was automatically generated by the ./github/compare-assets action.

TypeScript Errors Report

  • Files with errors: 467
  • Total errors: 2251

🎉 🎉 This PR does not introduce new TS errors.

comments-aggregator

@github-actions
Copy link
Contributor

Size Change: +1 B (0%)

Total Size: 1.1 MB

Filename Size Change
build/mini-cart-contents.js 18 kB +1 B (0%)
ℹ️ View Unchanged
Filename Size
build/active-filters-frontend.js 8.65 kB
build/active-filters-wrapper-frontend.js 7.61 kB
build/active-filters.js 7.47 kB
build/all-products-frontend.js 12 kB
build/all-products.js 40 kB
build/all-reviews.js 7.85 kB
build/attribute-filter-wrapper--stock-filter-wrapper-frontend.js 4.04 kB
build/attribute-filter-wrapper-frontend.js 4.29 kB
build/attribute-filter.js 13.2 kB
build/blocks-checkout.js 35.1 kB
build/breadcrumbs.js 2.13 kB
build/cart-blocks/cart-accepted-payment-methods-frontend.js 1.39 kB
build/cart-blocks/cart-cross-sells-frontend.js 254 B
build/cart-blocks/cart-cross-sells-products--product-price-frontend.js 2.92 kB
build/cart-blocks/cart-cross-sells-products-frontend.js 3.71 kB
build/cart-blocks/cart-express-payment--checkout-blocks/express-payment-frontend.js 5.17 kB
build/cart-blocks/cart-express-payment-frontend.js 720 B
build/cart-blocks/cart-items-frontend.js 301 B
build/cart-blocks/cart-line-items--mini-cart-contents-block/products-table-frontend.js 5.51 kB
build/cart-blocks/cart-line-items-frontend.js 1.06 kB
build/cart-blocks/cart-order-summary-frontend.js 1.27 kB
build/cart-blocks/cart-totals-frontend.js 308 B
build/cart-blocks/empty-cart-frontend.js 346 B
build/cart-blocks/filled-cart-frontend.js 656 B
build/cart-blocks/order-summary-coupon-form-frontend.js 1.63 kB
build/cart-blocks/order-summary-discount-frontend.js 2.13 kB
build/cart-blocks/order-summary-fee-frontend.js 273 B
build/cart-blocks/order-summary-heading-frontend.js 333 B
build/cart-blocks/order-summary-shipping-frontend.js 17.1 kB
build/cart-blocks/order-summary-subtotal-frontend.js 274 B
build/cart-blocks/order-summary-taxes-frontend.js 435 B
build/cart-blocks/proceed-to-checkout-frontend.js 1.38 kB
build/cart-frontend.js 29.9 kB
build/cart.js 45.1 kB
build/catalog-sorting.js 1.7 kB
build/checkout-blocks/actions-frontend.js 1.85 kB
build/checkout-blocks/billing-address--checkout-blocks/shipping-address-frontend.js 4.7 kB
build/checkout-blocks/billing-address-frontend.js 1.19 kB
build/checkout-blocks/contact-information-frontend.js 2.04 kB
build/checkout-blocks/express-payment-frontend.js 1.14 kB
build/checkout-blocks/fields-frontend.js 332 B
build/checkout-blocks/order-note-frontend.js 1.14 kB
build/checkout-blocks/order-summary-cart-items-frontend.js 3.68 kB
build/checkout-blocks/order-summary-coupon-form-frontend.js 1.79 kB
build/checkout-blocks/order-summary-discount-frontend.js 2.29 kB
build/checkout-blocks/order-summary-fee-frontend.js 277 B
build/checkout-blocks/order-summary-frontend.js 1.27 kB
build/checkout-blocks/order-summary-shipping-frontend.js 17 kB
build/checkout-blocks/order-summary-subtotal-frontend.js 274 B
build/checkout-blocks/order-summary-taxes-frontend.js 436 B
build/checkout-blocks/payment-frontend.js 8.28 kB
build/checkout-blocks/pickup-options-frontend.js 4.85 kB
build/checkout-blocks/shipping-address-frontend.js 1.17 kB
build/checkout-blocks/shipping-method-frontend.js 2.63 kB
build/checkout-blocks/shipping-methods-frontend.js 6.4 kB
build/checkout-blocks/terms-frontend.js 1.56 kB
build/checkout-blocks/totals-frontend.js 361 B
build/checkout-frontend.js 32 kB
build/checkout.js 46.4 kB
build/customer-account.js 3.18 kB
build/featured-category.js 15.1 kB
build/featured-product.js 15.3 kB
build/filter-wrapper-frontend.js 14.3 kB
build/filter-wrapper.js 2.4 kB
build/general-style-rtl.css 1.31 kB
build/general-style.css 1.31 kB
build/handpicked-products.js 8.04 kB
build/legacy-template.js 6.47 kB
build/mini-cart-component-frontend.js 28.5 kB
build/mini-cart-contents-block/cart-button-frontend.js 1.73 kB
build/mini-cart-contents-block/checkout-button-frontend.js 1.73 kB
build/mini-cart-contents-block/empty-cart-frontend.js 362 B
build/mini-cart-contents-block/filled-cart-frontend.js 267 B
build/mini-cart-contents-block/footer-frontend.js 4.09 kB
build/mini-cart-contents-block/items-frontend.js 237 B
build/mini-cart-contents-block/products-table-frontend.js 593 B
build/mini-cart-contents-block/shopping-button-frontend.js 526 B
build/mini-cart-contents-block/title-frontend.js 1.9 kB
build/mini-cart-contents-block/title-items-counter-frontend.js 1.59 kB
build/mini-cart-contents-block/title-label-frontend.js 1.53 kB
build/mini-cart-frontend.js 2.66 kB
build/mini-cart.js 4.43 kB
build/price-filter-wrapper-frontend.js 6.75 kB
build/price-filter.js 8.55 kB
build/price-format.js 1.19 kB
build/product-add-to-cart--product-button--product-image--product-price--product-rating--product-sale-bad--49d3ecb2.js 250 B
build/product-add-to-cart--product-button--product-image--product-rating--product-title.js 151 B
build/product-add-to-cart-frontend.js 6.52 kB
build/product-add-to-cart.js 8.84 kB
build/product-best-sellers.js 8.35 kB
build/product-button--product-image--product-price--product-rating--product-sale-badge--product-sku--prod--5bce0384.js 954 B
build/product-button-frontend.js 2.65 kB
build/product-button.js 3.97 kB
build/product-categories.js 2.37 kB
build/product-category.js 9.36 kB
build/product-collection.js 9.9 kB
build/product-image-frontend.js 2.62 kB
build/product-image.js 4.14 kB
build/product-new.js 8.65 kB
build/product-on-sale.js 8.68 kB
build/product-price-frontend.js 203 B
build/product-price.js 1.68 kB
build/product-query.js 11.8 kB
build/product-rating-frontend.js 2.27 kB
build/product-rating.js 971 B
build/product-results-count.js 1.66 kB
build/product-sale-badge-frontend.js 1.79 kB
build/product-sale-badge.js 665 B
build/product-search.js 2.63 kB
build/product-sku-frontend.js 1.84 kB
build/product-sku.js 536 B
build/product-stock-indicator-frontend.js 2.03 kB
build/product-stock-indicator.js 730 B
build/product-summary-frontend.js 2.19 kB
build/product-summary.js 904 B
build/product-tag.js 9.01 kB
build/product-template.js 3.34 kB
build/product-title-frontend.js 2.21 kB
build/product-title.js 3.66 kB
build/product-top-rated.js 8.91 kB
build/products-by-attribute.js 9.75 kB
build/rating-filter-frontend.js 21.4 kB
build/rating-filter-wrapper-frontend.js 6.2 kB
build/rating-filter.js 6.89 kB
build/reviews-by-category.js 12.1 kB
build/reviews-by-product.js 13.3 kB
build/reviews-frontend.js 7.18 kB
build/single-product.js 11.1 kB
build/stock-filter-wrapper-frontend.js 2.98 kB
build/stock-filter.js 7.61 kB
build/store-notices.js 1.69 kB
build/vendors--attribute-filter-wrapper--cart-blocks/order-summary-coupon-form--cart-blocks/order-summary--48e1e4bb-frontend.js 6.82 kB
build/vendors--attribute-filter-wrapper--cart-blocks/order-summary-shipping--checkout-blocks/billing-addr--d9f38f9d-frontend.js 4.21 kB
build/vendors--attribute-filter-wrapper--stock-filter-wrapper-frontend.js 5.11 kB
build/vendors--cart-blocks/cart-cross-sells-products--cart-blocks/cart-line-items--cart-blocks/cart-order--3c5fe802-frontend.js 5.26 kB
build/vendors--cart-blocks/cart-line-items--checkout-blocks/order-summary-cart-items--mini-cart-contents---233ab542-frontend.js 3.57 kB
build/vendors--cart-blocks/order-summary-shipping--checkout-blocks/billing-address--checkout-blocks/order--decc3dc6-frontend.js 19.4 kB
build/vendors--checkout-blocks/pickup-options--checkout-blocks/shipping-methods-frontend.js 8.25 kB
build/vendors--checkout-blocks/shipping-method-frontend.js 12.5 kB
build/vendors--price-filter-wrapper-frontend.js 2.2 kB
build/vendors--product-add-to-cart-frontend.js 7.26 kB
build/vendors--rating-filter-wrapper-frontend.js 5.11 kB
build/wc-blocks-data.js 22.4 kB
build/wc-blocks-editor-style-rtl.css 5.96 kB
build/wc-blocks-editor-style.css 5.96 kB
build/wc-blocks-google-analytics.js 1.56 kB
build/wc-blocks-middleware.js 933 B
build/wc-blocks-registry.js 3.15 kB
build/wc-blocks-shared-context.js 1.52 kB
build/wc-blocks-shared-hocs.js 1.75 kB
build/wc-blocks-style-rtl.css 27.9 kB
build/wc-blocks-style.css 27.8 kB
build/wc-blocks-vendors-style-rtl.css 1.96 kB
build/wc-blocks-vendors-style.css 1.96 kB
build/wc-blocks-vendors.js 65 kB
build/wc-blocks.js 3.7 kB
build/wc-payment-method-bacs.js 816 B
build/wc-payment-method-cheque.js 811 B
build/wc-payment-method-cod.js 909 B
build/wc-payment-method-paypal.js 837 B
build/wc-settings.js 2.6 kB
build/wc-shipping-method-pickup-location.js 30.4 kB
build/woo-directives-runtime.js 2.73 kB
build/woo-directives-vendors.js 7.91 kB

compressed-size-action

Copy link
Contributor

@gigitux gigitux left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM :shipit:

@Aljullu Aljullu merged commit 94a1cde into trunk May 31, 2023
@Aljullu Aljullu deleted the fix/mini-cart-proceed-to-checkout-button-editor-colors branch May 31, 2023 11:58
@Aljullu Aljullu added the type: bug The issue/PR concerns a confirmed bug. label May 31, 2023
Aljullu added a commit that referenced this pull request May 31, 2023
Aljullu added a commit that referenced this pull request May 31, 2023
Aljullu added a commit that referenced this pull request Jun 1, 2023
* Empty commit for release pull request

* Empty commit for release pull request

* Add 10.2.2 changelog

* Update versions to 10.2.2

* Fix Mini-Cart block check to see whether a script has already been enqueued (#9649)

* Experiment: Replace style hooks coming from `@wordpress/block-editor` (#9251)

* Replace all style hooks with useStyleProps hook

* Remove border/color/spacing hooks

* Style Props Hook

* Make use of `change-case` package

* Tidy up block wrappers

* Attribute filter does not use frontend.ts nor styles within block

* Remove frontend from filter blocks and unused styleprops usage

* Tidy up variable names so its clearer attributes are not required specifically from blocks

* Update assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/mini-cart-title-label-block/block.tsx

Co-authored-by: Albert Juhé Lluveras <[email protected]>

* Update assets/js/blocks/attribute-filter/block-wrapper.tsx

Co-authored-by: Albert Juhé Lluveras <[email protected]>

* Update assets/js/blocks/active-filters/block-wrapper.tsx

Co-authored-by: Albert Juhé Lluveras <[email protected]>

* Update assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/mini-cart-checkout-button-block/block.tsx

Co-authored-by: Tom Cafferkey <[email protected]>

* Update assets/js/blocks/rating-filter/block-wrapper.tsx

Co-authored-by: Tom Cafferkey <[email protected]>

* Update assets/js/blocks/stock-filter/block-wrapper.tsx

Co-authored-by: Tom Cafferkey <[email protected]>

* Update assets/js/blocks/price-filter/block-wrapper.tsx

Co-authored-by: Tom Cafferkey <[email protected]>

* Update assets/js/blocks/mini-cart/mini-cart-contents/inner-blocks/mini-cart-cart-button-block/block.tsx

Co-authored-by: Tom Cafferkey <[email protected]>

* Simplify styleprop

* Styleprops simplify

* Fix withFeaturedItem styles

* Like the original hook, flatten props and combine with parsed styles

---------

Co-authored-by: Albert Juhé Lluveras <[email protected]>
Co-authored-by: Tom Cafferkey <[email protected]>

* Add 10.2.2 testing steps

* Fix colors not being applied to Mini-Cart Proceed to Checkout Button in the editor (#9661)

* Update 10.2.2 testing steps

---------

Co-authored-by: github-actions <[email protected]>
Co-authored-by: Albert Juhé Lluveras <[email protected]>
Co-authored-by: Mike Jolley <[email protected]>
Co-authored-by: Tom Cafferkey <[email protected]>
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
block: mini-cart Issues related to the Mini-Cart block. skip-changelog PRs that you don't want to appear in the changelog. type: bug The issue/PR concerns a confirmed bug.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants